<template>
  <div>
    <div class="my-page__top">
      <div class="my-page_top-row">
        <nut-avatar size="large" :icon="avatarUrl" />

        <span class="my-page__top-name">旅美美用户</span>
      </div>
    </div>

    <nut-cell-group>
      <nut-cell title="收货地址" icon="location2" is-link @click="toAddress" />
    </nut-cell-group>

    <div class="my-page__bottom">
      <nut-button plain type="info" @click="logout">退出登录</nut-button>
    </div>
  </div>
</template>

<script lang="ts" setup>
import Taro from '@tarojs/taro'
// import { Tabbar, TabbarItem } from '@nutui/nutui-taro';
import { removeStorage } from '../../utils/storage'
import avatarUrl from '@/static/img/avatar.png'

// function tabSwitch(item: object, index: number) {
//   console.log(item, index);
// }
function logout() {
  removeStorage('openid')
  removeStorage('token')
  Taro.reLaunch({
    url: '/pages/login/index',
  })
}

function toAddress() {
  Taro.navigateTo({
    url: '/pages/address/index',
  })
}
</script>

<style lang="scss">
page {
  background-color: $page-bc;
}

.my-page__top {
  background-color: #fff;
  padding: 10px;
  // .nut-avatar {
  // }
}

.my-page_top-row {
  display: inline-flex;
  align-items: center;
}

.my-page__top-name {
  margin-left: 10px;
}

.my-page__bottom {
  margin: 20px;
  text-align: center;
}
</style>
